.pageContainer {
  height: 100vh;
  width: 1200px; // 固定页面宽度
  margin: 0 auto; // 居中显示
  overflow-x: auto; // 允许横向滚动
  white-space: nowrap; // 禁止内容换行
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE 和 Edge */
  &::-webkit-scrollbar {
    display: none; /* Chrome 和 Safari */
  }
}

// Input.Search
.search {
  margin-bottom: 8;
  align-items: center;
  width: 55%;
}
// List
.listContainer {
  display: flex;
  flex-grow: 1;
  height: 90%;
  margin-top: 32px;
}

// pagination
.pagination {
  // margin-top: 1%;
  // margin-left: 25%;
  text-align: center;
}



// BookCard
.bookCard {
  display: flex; // 卡片横向排列
  width: 500px; // 固定卡片宽度
  margin-right: 16px; // 卡片之间的间距
  border: 1px solid #f0f0f0; // 添加边框
  border-radius: 8px; // 圆角
  overflow: hidden; // 防止内容溢出
  background-color: #fff; // 背景色
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); // 阴影效果

  .cover {
    width: 120px; // 封面宽度
    height: 160px; // 封面高度
    object-fit: cover; // 保持图片比例
    margin-right: 0px; // 封面与内容之间的间距
  }

  .details {
    flex: 1;
    padding: 8px;

    .title {
      font-size: 18px;
      font-weight: bold;
      margin-bottom: 4px;
    }

    .author {
      font-size: 14px;
      color: #666;
      margin-bottom: 4px;
    }

    .tags {
      font-size: 14px;
      color: #666;
      margin-bottom: 4px;
    }

    .description {
      font-size: 14px;
      color: #666;
      white-space: normal; /* 允许文本换行 */
      word-wrap: break-word; /* 强制在单词边界换行 */
      overflow: hidden; /* 超过容器的部分隐藏 */
      text-overflow: ellipsis; /* 省略号截断溢出的文本 */
      display: -webkit-box;
      -webkit-line-clamp: 3; /* 最大显示三行 */
      line-clamp: 3;
      -webkit-box-orient: vertical; /* 必须和 -webkit-line-clamp 配合使用 */
    }
  }
}

@media (max-width: 768px) {
  .bookCard {
    // overflow-x: auto; // 允许横向滚动
    white-space: nowrap; // 禁止内容换行
  }
}